.search-area-box{
  .dropdown-arrow{
    text-align: center;
    button{
      width: 68px;
      transform: translateY(-22px);
      background-color: $background-white;
      border: 1px solid $divide-line;
      border-radius: 12px;
      color: $font-default;
      font-size: 12px;
      img{
        width: 12px;
        height: 12px;
        margin-right: 2px;
        margin-top: -2px;
      }
    }
    i{
      -webkit-transform: rotateZ(-90deg);
      -moz-transform: rotateZ(-90deg);
      -ms-transform: rotateZ(-90deg);
      -o-transform: rotateZ(-90deg);
      transform: rotateZ(-90deg);
    }
  }
}
  .ant-input > span { color: $font-disabled; }
  .ant-advanced-search-form.search-area {
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    // overflow: hidden;

    .ant-calendar-picker{
      width: 100%;
    }
    .item-label {
      display: block;
      margin-top: 0.4em;
      font-size: 16px;
    }
    .toggle-button{
      margin-right: 16px;
      font-size: 12px;
    }
    .ant-form-item-label label{
      color: $font-default;
    }
    .ant-form-item-label{
      line-height: 25px;
    }
    .ant-radio-group.ant-radio-group-large {
      white-space: nowrap;
      width: 100%;
      .ant-radio-button-wrapper{
        width: 50%;
        padding: 0;
        text-align: center;
      }
    }
    .checkbox-list-form {
      border: 1px solid $divide-line;
      -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
      border-radius: 6px;
      margin-bottom: 10px;
      .check-all-option {
        position: absolute;
        z-index: 1;
        padding: 7px 10px 5px;
      }
      .ant-radio-group{
        white-space: normal;
        display: block;
      }
      .list-row {
        .list-col-header {
          background: $background-title;
          text-align: right;
          padding-right:20px;
          height: 100%;
          position: absolute;
          line-height: 44px;
        }
        .ant-checkbox-wrapper,.ant-radio-wrapper{
          margin-left: 0 !important;
          margin-right: 8px !important;
        }
        .list-col-content {
          padding: 5px 10px;
          float: right;
          overflow: hidden;
          line-height: 34px;
          .antd-pro-tag-select-tagSelect {
            max-height: unset;
          }
        }
      }
      .ant-row.ant-form-item {
        margin-bottom: 0;
        &:not(:first-child) {
          border-top: 1px solid $divide-line;
        }
        &:first-child {
          .list-col-header {
            border-top-left-radius: 5px;
          }
        }
        &:last-child {
          .list-col-header {
            border-bottom-left-radius: 5px;
          }
        }
      }
    }
    .antd-pro-tag-select-tagSelect {
      margin-left: 0;
    }
    .antd-pro-tag-select-tagSelect.antd-pro-tag-select-expanded {
      max-height: unset;
    }

    .common-top-area .col-height-auto {
      height: auto !important;
    }

    .common-top-area > .ant-row > div {
      height: 80px;
    }

    .hide-top-area > .ant-row > div {

    }

  }
  .cost-center-search-modal {
    .ant-modal-body {
      height: 500px;
      overflow-y: auto;
    }
  }

.filter-tags {
  i {
    cursor: pointer;
    &:hover {
      color: $default-color;
    }
  }
  .filter-tag-list {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 40px);
    margin: 0 6px;
    line-height: initial;
    white-space: nowrap;
    overflow: hidden;
    #tag-container{
      display: inline-block;
      width: 100%;
      -webkit-transition: all 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
      -moz-transition: all 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
      -ms-transition: all 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
      -o-transition: all 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: all 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
    }
  }
  .filter-tag{
    height: 24px;
    line-height: 24px;
    background-color: $background-white;
    color: $font-default;
  }
  .filter-tag.checked{
    background-color: $default-color;
    border-color: $default-color;
    color: $font-ghost;
    i{color: $font-ghost;}
  }
}
